<template>
	<view class="content">
		<u-navbar bgColor="transparent" titleStyle="color:#fff" :title="title" leftIconColor="#fff" :autoBack="true"
			:placeholder="false">
		</u-navbar>
		<view style="height: 70rpx;"></view>
		<view class="info-item">
			<view class="info-title">
				收件人
			</view>
			<u--input placeholder="姓名" border="none" v-model="name" placeholderStyle="color:'#999'"
				color="#fff"></u--input>
		</view>
		<view class="info-item">
			<view class="info-title">
				电话
			</view>
			<u--input placeholder="手机号码" border="none" v-model="tell" placeholderStyle="color:'#999'"
				color="#fff" maxlength="11" type="number"></u--input>
		</view>
		<view class="info-item">
			<view class="info-title">
				地区
			</view>
			<u--input placeholder="北京市,北京市,东城区" border="none" v-model="region" placeholderStyle="color:'#999'"
				color="#fff"></u--input>
		</view>
		<view class="info-item">
			<view class="info-title">
				详细地址
			</view>
			<u--input placeholder="街道、小区、楼栋号、单元室等" border="none" v-model="address" placeholderStyle="color:'#999'"
				color="#fff"></u--input>
		</view>
		<view class="info-item">
			<view class="info-title">
				默认地址
			</view>
			<u-switch v-model="value" inactiveColor="#d6d6d6" activeColor="#98F083"></u-switch>
		</view>
		<view class="btn">
			<u-button size="large" @click="goadd" class="btn-color" shape="circle" color="linear-gradient( 90deg, #C8F673 0%, #98F083 100%)" type="primary" text="提交"></u-button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				id:'',
				name: '',
				tell: '',
				region: '',
				address: '',
				value:false,
				title:'',
				num:1
			}
		},
		onLoad(e) {
			this.num = e.num
			if(e.num == 1){
				this.title = '新增地址'
			}else{
				this.title = '编辑地址'
				let info = JSON.parse(decodeURIComponent(e.item))
				this.id = info.id
				this.name = info.name
				this.tell = info.tel
				this.region = info.address_detail
				this.address = info.address_all
				this.value = info.status == 1?true:false
			}
		},
		methods:{
			goadd(){
				if(this.name == ''){
					uni.showToast({
						title:'收件人不能为空！',
						icon:'none'
					})
					return
				}
				if(this.tell == ''){
					uni.showToast({
						title:'手机号码不能为空！',
						icon:'none'
					})
					return
				}
				if(this.region == ''){
					uni.showToast({
						title:'地区不能为空！',
						icon:'none'
					})
					return
				}
				if(this.address == ''){
					uni.showToast({
						title:'详细地址不能为空！',
						icon:'none'
					})
					return
				}
				uni.showLoading({
					mask:true
				})
				if(this.num == 1){
					this.$Request({
						method: 'POST',
						url: '/api/shop/addressAdd',
						data: {
							tel:this.tell,
							name:this.name,
							status:this.value == true? 1:0,
							address_detail:this.region,
							address_all:this.address
							
						}
					}).then(res => {
						uni.hideLoading()
						if (res.code == 1) {
							uni.showToast({
								title:'添加成功！',
								icon:'none'
							})
							setTimeout(()=>{
								uni.navigateBack({
									delta:1
								})
							},1000)
						}else{
							uni.showToast({
								title:res.msg,
								icon:'none'
							})
						}
					})
				}else{
					this.$Request({
						method: 'POST',
						url: '/api/shop/addressEditPost',
						data: {
							id:this.id,
							tel:this.tell,
							name:this.name,
							status:this.value == true? 1:0,
							address_detail:this.region,
							address_all:this.address
						}
					}).then(res => {
						uni.hideLoading()
						if (res.code == 1) {
							uni.showToast({
								title:'修改成功！',
								icon:'none'
							})
							setTimeout(()=>{
								uni.navigateBack({
									delta:1
								})
							},1000)
						}else{
							uni.showToast({
								title:res.msg,
								icon:'none'
							})
						}
					})
				}
				
			}
		}
	}
</script>
<style>
	page {
		background-color: #17191A;
	}

	.btn-color {
		color: #17191A !important;
		font-weight: bold;
	}
</style>
<style lang="scss" scoped>
	.content {
		min-height: 100vh;
		background-image: url('../../../static/my/my-bg.png');
		background-repeat: no-repeat;
		background-size: 100% 558rpx;
		padding: 30rpx;

		.info-item {
			display: flex;
			align-items: center;
			padding-bottom: 30rpx;
			border-bottom: 1rpx solid #414547;
			margin-bottom: 30rpx;

			.info-title {
				width: 150rpx;
				font-size: 28rpx;
				font-weight: bold;
				color: #ffffff;
			}
		}
		.btn {
			margin-top: 80rpx;
		}
	}
</style>